<template>
  工作流名：<el-input v-model="name" placeholder="请输入内容"></el-input>
  <br>
  <br>
  <div v-for="(item, key) in the_list">
    字段名：<el-input v-model="item.name" placeholder="请输入内容"></el-input>
    类型：<el-input v-model="item.type" placeholder="请输入内容"></el-input>
    <el-button type="primary" @click="the_list.splice(key, 1)">删除字段</el-button>
  </div>
  是否上线：<el-radio v-model="status" label="是" :value="1" >是</el-radio> <el-radio v-model="status" label="否" :value="0" >否</el-radio>
  <br><br>
  <el-button type="primary" @click="add">添加字段</el-button>
  <el-button type="primary" @click="create">创建工作流</el-button>
</template>

<script setup>
  import { ref, onMounted } from "vue"
  import { useRoute, useRouter } from "vue-router";
  import http from "../http"

  const route = useRoute()
  const router = useRouter()

  let name = ref("")

  let status = ref(false)

  let the_list = ref([{"name": "", "type": ""}])

  const add=()=>{
    the_list.value.push({"name": "", "type": ""})
  }

  const create=()=>{
    http.post(`workflow/workflow/`, {"name": name.value, "params": the_list.value, "status": status.value})
    .then(res=>{
      console.log(res)
      router.push({path: '/workflow_role', query: {id: res.data.id}})
    })
    .catch(error=>{
      console.log(error)
    })
  }

</script>